<template>
<ul class="list clearfix" id="list">
	<li class="fl" @click="listInfo">
		<img src="../assets/img/quan.jpg">
		<span>全行业职业健康标准</span>
		<!-- <p v-html="item.note"></p> -->
	</li>
	<li class="fl" @click="listInfo">
		<img src="../assets/img/barcode.jpg">
		<span>全量包装食品条形码</span>
		<!-- <p v-html="item.note"></p> -->
	</li>
</ul>
</template>
<script>
    export default {
        props: {
            list: {
                type: Array
            }
        },
        methods: {
            listInfo() {
                this.$router.push('/apiDetail')
            }
        }
    }
</script>
<style lang="stylus" rel="stylesheet/stylus">
	@media screen and (min-width: 600px) and (max-width: 800px)
		#list
			li
				padding 10px
				margin-bottom 28px
				border-radius 8px
				span
					font-size 16px
					line-height 24px
					margin-top 8px
				p
					font-size 14px
					line-height 1.4
					margin-top 4px
	@media screen and (min-width: 450px) and (max-width: 600px)
		#list
			width 95%
			margin-left 2.5%
			li
				padding 10px
				margin-bottom 14px
				width 48.5%
				border-radius 6px
				&:nth-child(3n-1)
					margin 0 0 14px 0
				&:nth-child(2n-1)
					margin-right 3%
				span
					font-size 15px
					line-height 22px
					margin-top 6px
				p
					font-size 12px
					line-height 1.4
					margin-top 3px
	@media screen and (max-width: 450px)
		#list
			width 95%
			margin-left 2.5%
			li
				padding 8px
				margin-bottom 12px
				width 48.5%
				border-radius 6px
				&:nth-child(3n-1)
					margin 0 0 12px 0
				&:nth-child(2n-1)
					margin-right 3%
				span
					font-size 14px
					line-height 20px
					margin-top 5px
				p
					font-size 11px
					line-height 1.4
					margin-top 2px
	.list
		li
			box-shadow 0px 1px 15px 4px rgba(119,119,119,0.1)
			width 32%
			padding 14px
			box-sizing border-box
			margin-bottom 48px
			border-radius 10px
			&:nth-child(3n-1)
				margin 0 2% 48px 2%
			img
				width 100%
				// height 220px
			span
				display block
				font-size 18px
				color #2e2e2e
				line-height 28px
				margin-top 11px
				text-align center
			p
				font-size 14px
				color #777
				text-align center
				line-height 1.4
				margin-top 6px
				overflow hidden
				white-space nowrap
				text-overflow ellipsis
</style>
